<style type="text/css">
body {
    font-size: 12px;
    font-color: #333;
    font-family:Helvetica,Arial,sans-serif;
    background: #d5e4f7;
    padding: 2px;
}
textarea{
    border: 1px solid #b7c5e3;
    margin: 0;
    height: 64px;
    width: 320px;
    resize: none;
    background: #f0f5fb;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    padding: 2px;
    font-size: 12px;
    position: relative;
    z-index: 10;
}
textarea:focus {
    background: #fff;
}
textarea.full {
    border-color: #f60;
}

#d_clip_container span {
    background: #aaa; /*background: #f60;*/
    display: inline-block;
    padding: 2px 5px;
    color: #fff;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
     cursor: pointer;
}

span {
    display: inline-block;
    padding: 5px 5px;    
    border: 1px solid #d5e4f7;
    -webkit-border-radius: 3px;
     cursor: pointer;
     color: #000;
}
span:hover{border:1px solid #b7c5e3;}
#clean {
	width:75%; 
	color: #fff;
	text-align:center; 
	/*border:1px solid black; */
	background-color:#aaa; 	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	margin:5px; padding:5px; 
        }
#clean.hover { background-color:#eee; }
#clean.active { background-color:#aaa; }

a{color:#000;}
#user {padding:0 20%; list-style-type:none; }
#user li {display:block; float:left; width:30px; height:30px; position:relative;}
#user li a {display:block; width:20px; height:20px; background:transparent; overflow:hidden; position:relative;}
#user li a img {width:100%; height:100%; border:0;}
#user li a:hover {position:absolute; left:-10px; top:-10px; width:50px; height:50px; z-index:100;}
/*#user li a:hover {position:absolute; left:-2px; top:-5px; width:30px; height:30px; z-index:100;}*/

 
 
#bgadmin{
	-moz-opacity: 0.7;
	opacity: 0.7;
	top: 0;
	left: 0;
	position: fixed;
	width: 100%;
	height: 100%;	

	background-color: black;	
	z-index: 99;
}
 
#bgadmin2{	
	z-index: 100;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	position: fixed;
	top: 0;	

}
 
#admin2{	
	width: 330px;
	color: #fff;
	padding: 20px 0px;
}
 
</style>
<script type="text/javascript" >
if (!this.JSON) {this.JSON = {};}(function () {    function f(n) {        return n < 10 ? '0' + n : n;    }    if (typeof Date.prototype.toJSON !== 'function') {        Date.prototype.toJSON = function (key) {            return isFinite(this.valueOf()) ?                   this.getUTCFullYear()   + '-' +                 f(this.getUTCMonth() + 1) + '-' +                 f(this.getUTCDate())      + 'T' +                 f(this.getUTCHours())     + ':' +                 f(this.getUTCMinutes())   + ':' +                 f(this.getUTCSeconds())   + 'Z' : null;        };        String.prototype.toJSON =        Number.prototype.toJSON =        Boolean.prototype.toJSON = function (key) {            return this.valueOf();        };    }    var cx = /[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,        escapable = /[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,        gap,        indent,        meta = {                '\b': '\\b',            '\t': '\\t',            '\n': '\\n',            '\f': '\\f',            '\r': '\\r',            '"' : '\\"',            '\\': '\\\\'        },        rep;    function quote(string) {        escapable.lastIndex = 0;        return escapable.test(string) ?            '"' + string.replace(escapable, function (a) {                var c = meta[a];                return typeof c === 'string' ? c :                    '\\u' + ('0000' + a.charCodeAt(0).toString(16)).slice(-4);            }) + '"' :            '"' + string + '"';    }    function str(key, holder) {        var i,                      k,                      v,                      length,            mind = gap,            partial,            value = holder[key];        if (value && typeof value === 'object' &&                typeof value.toJSON === 'function') {            value = value.toJSON(key);        }        if (typeof rep === 'function') {            value = rep.call(holder, key, value);        }        switch (typeof value) {        case 'string':            return quote(value);        case 'number':            return isFinite(value) ? String(value) : 'null';        case 'boolean':        case 'null':            return String(value);        case 'object':            if (!value) {                return 'null';            }            gap += indent;            partial = [];            if (Object.prototype.toString.apply(value) === '[object Array]') {                length = value.length;                for (i = 0; i < length; i += 1) {                    partial[i] = str(i, value) || 'null';                }                v = partial.length === 0 ? '[]' :                    gap ? '[\n' + gap +                            partial.join(',\n' + gap) + '\n' +                                mind + ']' :                          '[' + partial.join(',') + ']';                gap = mind;                return v;            }            if (rep && typeof rep === 'object') {                length = rep.length;                for (i = 0; i < length; i += 1) {                    k = rep[i];                    if (typeof k === 'string') {                        v = str(k, value);                        if (v) {                            partial.push(quote(k) + (gap ? ': ' : ':') + v);                        }                    }                }            } else {                for (k in value) {                    if (Object.hasOwnProperty.call(value, k)) {                        v = str(k, value);                        if (v) {                            partial.push(quote(k) + (gap ? ': ' : ':') + v);                        }                    }                }            }            v = partial.length === 0 ? '{}' :                gap ? '{\n' + gap + partial.join(',\n' + gap) + '\n' +                        mind + '}' : '{' + partial.join(',') + '}';            gap = mind;            return v;        }    }    if (typeof JSON.stringify !== 'function') {        JSON.stringify = function (value, replacer, space) {            var i;            gap = '';            indent = '';            if (typeof space === 'number') {                for (i = 0; i < space; i += 1) {                    indent += ' ';                }            } else if (typeof space === 'string') {                indent = space;            }            rep = replacer;            if (replacer && typeof replacer !== 'function' &&                    (typeof replacer !== 'object' ||                     typeof replacer.length !== 'number')) {                throw new Error('JSON.stringify');            }            return str('', {'': value});        };    }    if (typeof JSON.parse !== 'function') {        JSON.parse = function (text, reviver) {            var j;            function walk(holder, key) {                var k, v, value = holder[key];                if (value && typeof value === 'object') {                    for (k in value) {                        if (Object.hasOwnProperty.call(value, k)) {                            v = walk(value, k);                            if (v !== undefined) {                                value[k] = v;                            } else {                                delete value[k];                            }                        }                    }                }                return reviver.call(holder, key, value);            }            cx.lastIndex = 0;            if (cx.test(text)) {                text = text.replace(cx, function (a) {                    return '\\u' +                        ('0000' + a.charCodeAt(0).toString(16)).slice(-4);                });            }            if (/^[\],:{}\s]*$/.test(text.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, '@').replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']').replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {                j = eval('(' + text + ')');                return typeof reviver === 'function' ?                    walk({'': j}, '') : j;            }            throw new SyntaxError('JSON.parse');        };    }}());

function $(id) { return document.getElementById(id); }

addEventListener('load', function()
{
	var laurl = '';
	var titulo ='';
	//get current location for settings page
	var xtsurl=location.href;
	xtsurl=xtsurl.substring(0,xtsurl.length-11);
	$('settings').innerHTML='<a href="'+xtsurl+'/options.html'+'">Settings</a>';
	//finds data about the current tab
	chrome.tabs.getSelected(null,function(tab) {
		laurl=tab.url;
		titulo=tab.title;
	});
	//reads  options
	var user=localStorage['username'];
	if(user){
		if(user.length>0){
		$('user').innerHTML='@'+user+'<br />';
		$('postwit').style.display='';
		//$('stwit').style.display='none';
		}
	}
	var pass=localStorage['password'];
	if(!pass){
	//	$('user').innerHTML=$('user').innerHTML+'<br />No password information.';
	}
	var includetitle=localStorage['includetitle'];
		
	//read the url shorteners
	
	//Bit.Ly
	var op_bitly = localStorage['bitly'];
	var bitlyid = localStorage['bitlyid'];
	var bitlyapi = localStorage['bitlyapi'];
	if(op_bitly=='true'){
		var p = document.createElement('li');
		p.id='bitly';
		p.innerHTML = '<a href="#"><img src="images/bit.ly.png" atitle="Bit.Ly"/></a>';
		$('user').appendChild(p);	
	}	
	var bitly = $('bitly');
	var bitlyURL = {};
	if (bitly) {
		bitly.addEventListener("click", function() {
			xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function(){
				if(xhr.readyState == 4 && xhr.status==200){
					//let's parse resultant shor url
					var bitlyresult = xhr.responseText;					
					/*var bitlypos=bitlyresult.search('"shortUrl": "http://bit.ly/');
					if(bitlypos!=-1){
						bitlyresult = bitlyresult.substring(bitlypos+13);
						bitlypos=bitlyresult.search('"');
						if(bitlypos!=-1){
							bitlyresult = bitlyresult.substring(0,bitlypos);
						}						
					}else{
						bitlyresult="Error!";
					}*/
					bitlyURL = JSON.parse(xhr.responseText);
					if(bitlyURL['errorMessage'].length==0)
					bitlyresult=bitlyURL['results'][laurl]['shortUrl'];
					else bitlyresult=bitlyURL['errorMessage'];
					if(includetitle=='true')
					$("fe_text").innerHTML = titulo+' '+ bitlyresult;
					else
					$("fe_text").innerHTML = bitlyresult;					
					hideAdmin();
					$("fe_text").select();
					$("fe_text").focus();						
				}						
			}
			showAdmin();
			xhr.open('GET','http://api.bit.ly/shorten?version=2.0.1&longUrl='+encodeURIComponent(laurl)+'&login='+bitlyid+'&apiKey='+bitlyapi+'&format=json',true);
			xhr.send(null);			
		}, false);
	}
	//IS.GD
	var op_isgd = localStorage['isgd'];
	if(op_isgd=='true'){
		var p = document.createElement('li');
		p.id='isgd';
		p.innerHTML = '<a href="#"><img src="images/is.gd.png" /></a>';
		$('user').appendChild(p);	
	}	
	var isgd = $('isgd');
	if (isgd) {
		isgd.addEventListener("click", function() {
			xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function(){
				if(xhr.readyState == 4 && xhr.status==200){
					if(includetitle=='true')
					$("fe_text").innerHTML = titulo+' '+ xhr.responseText;					
					else
					$("fe_text").innerHTML = xhr.responseText;										
					hideAdmin();
					$("fe_text").select();
					$("fe_text").focus();						
				}		
			}
			showAdmin();
			xhr.open('GET','http://is.gd/api.php?longurl='+encodeURIComponent(laurl),true);
			xhr.send(null);			
		}, false);
	}
	//IR.PE
	var op_irpe = localStorage['irpe'];
	if(op_irpe=='true'){
		var p = document.createElement('li');
		p.id='irpe';
		p.innerHTML = '<a href="#"><img src="images/ir.pe.png" /></a>';
		$('user').appendChild(p);	
	}	
	var irpe = $('irpe');
	if (irpe) {
		irpe.addEventListener("click", function() {
			xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function(){
				if(xhr.readyState == 4 && xhr.status==200){
					if(includetitle=='true')
					$("fe_text").innerHTML = titulo+' '+ xhr.responseText;
					else $("fe_text").innerHTML = xhr.responseText;					
					hideAdmin();
					$("fe_text").select();
					$("fe_text").focus();					
				}		
			}
			showAdmin();
			xhr.open('GET','http://ir.pe/?url='+encodeURIComponent(laurl)+'&api=1',true);
			xhr.send(null);			
		}, false);
	}
	//TinyURL
	var op_tiny = localStorage['tiny'];
	if(op_tiny=='true'){
		var p = document.createElement('li');
		p.id='tiny';
		p.innerHTML = '<a href="#"><img src="images/tinyurl.bmp" /></a>';
		$('user').appendChild(p);	
	}	
	var tiny = $('tiny');
	if (tiny) {
		tiny.addEventListener("click", function() {
			xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function(){
				if(xhr.readyState == 4 && xhr.status==200){
					if(includetitle=='true')
					$("fe_text").innerHTML = titulo+' '+ xhr.responseText;
					else
					$("fe_text").innerHTML = xhr.responseText;										
					hideAdmin();
					$("fe_text").select();
					$("fe_text").focus();					
				}		
			}
			showAdmin();
			xhr.open('GET','http://tinyurl.com/api-create.php?url='+encodeURIComponent(laurl),true);
			xhr.send(null);			
		}, false);
	}
	//TR.IM
	var op_trim = localStorage['trim'];
	if(op_trim=='true'){
		var p = document.createElement('li');
		p.id='trim';
		p.innerHTML = '<a href="#"><img src="images/tr.im.png" /></a>';
		$('user').appendChild(p);	
	}	
	var trim = $('trim');
	if (trim) {
		trim.addEventListener("click", function() {
			xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function(){
				if(xhr.readyState == 4 && xhr.status==200){
					if(includetitle=='true')
					$("fe_text").innerHTML = titulo+' '+ xhr.responseText;
					else
					$("fe_text").innerHTML = xhr.responseText;					
					hideAdmin();
					$("fe_text").select();
					$("fe_text").focus();					
				}		
			}
			showAdmin();
			xhr.open('GET','http://api.tr.im/v1/trim_simple?url='+encodeURIComponent(laurl),true);
			xhr.send(null);			
		}, false);
	}
	//CLI.GS
	var op_cligs = localStorage['cligs'];
	var cligsid = localStorage['cligsid'];
	var cligsapi = localStorage['cligsapi'];
	
	if(op_cligs=='true'){
		var p = document.createElement('li');
		p.id='cligs';
		p.innerHTML = '<a href="#"><img src="images/cligs.png" /></a>';
		$('user').appendChild(p);	
	}	
	var cligs = $('cligs');
	if (cligs) {
		cligs.addEventListener("click", function() {
			xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function(){
				if(xhr.readyState == 4 && xhr.status==200){
					if(includetitle=='true')
					$("fe_text").innerHTML = titulo+' '+ xhr.responseText;				
					else
					$("fe_text").innerHTML = xhr.responseText;									
					$("fe_text").select();
					$("fe_text").focus();					
					hideAdmin();
				}		
			}
			showAdmin();
			if(cligsid && cligsapi && cligsid.length>0 && cligsapi.length>0)
			xhr.open('GET','http://cli.gs/api/v1/cligs/create?url='+encodeURIComponent(laurl)+'&key='+cligsapi+'&appid='+cligsid,true);
			else
			xhr.open('GET','http://cli.gs/api/v1/cligs/create?url='+encodeURIComponent(laurl),true);
			xhr.send(null);			
		}, false);
	}
	/////////////
	var twite = $('postwit');
	if (twite) {		
		twite.addEventListener("click", function() {				
			if($('fe_text').value.length==0)return false;
			xmlh= new XMLHttpRequest();
			xmlh.onreadystatechange = function(){
				if(xmlh.readyState==4){
					var a = $('sent');
					$('d_debug').removeChild(a);
					var p = document.createElement('p');
					if(xmlh.status==200||xmlh.status==304){
						p.innerHTML = '<strong>Status updated!</strong>';
					}else{						
						p.innerHTML = 'There was an error!';
					}
					$('d_debug').appendChild(p);	
				}
			}
			var a = document.createElement('p');
			a.id='sent';
			a.innerHTML = '<img src="images/ajax-loader.gif" />';			
			$('d_debug').appendChild(a);	
			xmlh.open('POST','https://twitter.com/statuses/update.xml',true,user,pass);
			xmlh.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
			xmlh.send("status="+encodeURIComponent($('fe_text').value));
		}, false);
	}
	
	var stwits = $('stwit');
	if (stwits) {		
		stwits.addEventListener("click", function() {				
			//post directly to twitter
			if($('fe_text').value.length>0)
			chrome.tabs.create({url:'http://twitter.com/?status='+encodeURIComponent($("fe_text").value)});
		}, false);
	}
	
	var settings = $('settings');
	if(settings){
		settings.addEventListener("click",function(){
			chrome.tabs.create({url:xtsurl+'/option.html'});
		},false);
	}
	
	var clipboard = $('d_clip_button');
	if(clipboard){	
		clipboard.addEventListener("click", function() {
			var p = document.createElement('p');
			if($('fe_text').value.length >0){
				$('fe_text').select();
				document.execCommand("copy");
				p.innerHTML = 'Copied : '+$('fe_text').value;
			}
			else p.innerHTML = 'Nothing to copy';
			$('d_debug').appendChild(p);		
		},false);
	}
}, 0);

function viewtweets(){
            if ($('fe_text').value.length > 140) {
         	$('d_debug').innerHTML="More than 140 letters!";
                return false;
            } else {
         	$('d_debug').innerHTML="";
                return true;
            }

}       
        
function showAdmin(){
$('bgadmin').style.display='';
$('bgadmin2').style.display='';
}
function hideAdmin(){
$('bgadmin').style.display='none';
$('bgadmin2').style.display='none';
}	
</script>
<div id="bgadmin" style="display:none;">&nbsp;</div> 
<div id="bgadmin2" style="display:none;" onclick="hideAdmin();"> 
  <div id="admin2" align="center"> 
  <img src="images/loadings.gif" />
  </div> 
</div> 
<div style="width:320px" align="center">
<div id='settings' style="position:absolute">Settings</div>
<div id='user'>&nbsp;</div>
	<textarea id="fe_text"  onKeyUp="viewtweets()" onChange="clip.setText(this.value)"></textarea>
	<div>&nbsp;</div>
	<div id="d_clip_container">
		<span id="d_clip_button">Send to clipboard</span>
		<span id="postwit" style="display:none">Tweet Now</span>
		<span id="stwit">Use Twitter</span>
	</div>
	<div id="d_debug" style="color:#000;"> </div>
</div>
